<template>
  <a-modal
    v-model="show"
    title="用户信息"
    width="800px"
    :footer="null"
    :maskClosable="false"
    @cancel="$emit('cancel', false)"
  >
    <div class="deal-detail">
      <a-row>
        <a-col :span="24">
          <span class="label">编号：</span>
          <span class="text">{{ userInfo.userNo }}</span>
        </a-col>
        <a-col :span="24">
          <span class="label">编类型：</span>
          <span class="text">{{ userInfo.usertype }}</span>
        </a-col>

        <a-col :span="24">
          <span class="label">用户名：</span>
          {{ userInfo.userName }}
        </a-col>
        <a-col :span="24">
          <span class="label">手机号：</span>
          {{ userInfo.mobile }}
        </a-col>
      </a-row>
    </div>
  </a-modal>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    ...mapGetters(["userInfo"]),
    show: {
      get() {
        return this.visible;
      },
      set(value) {
        this.$emit("update:visible", value);
      }
    }
  }
};
</script>

<style lang="less" scoped>
.deal-detail {
  min-height: 180px;
  padding: 20px 64px;
  /deep/.ant-col {
    height: 40px;
    line-height: 40px;
  }
}
</style>
